import { defineComponent, h , toRefs, watch, onMounted, onUnmounted} from 'vue'
import enemyImage from '../../resource/assets/enemy.png'
import game from '../Game'

export default defineComponent({
  props: ['x','y'],
  setup(props, ctx) {
    //普通解构会导致响应式丢失
    const {x, y} = toRefs(props)
    let startTime = 0;
    let attackTime = parseInt(Math.random() * 100) + 50;
    let enemyAttack = function () {
      startTime++      
      if (startTime >= attackTime) {
        ctx.emit('eattack', {x, y})
        console.log('敌人攻击了1', attackTime);
        startTime = 0
      }
    }
   
    onMounted(()=> {
      game.ticker.add(enemyAttack)
    })
    onUnmounted(()=> {
      game.ticker.remove(enemyAttack)
    })


    return {
      x,
      y
    }
  },
  render(ctx) {
    return  h('Container', {x:ctx.x, y:ctx.y} , [ 
      h('Sprite', {texture: enemyImage , width: 90, height: 90 })
    ])
  }
})